import { createRouter, createWebHashHistory } from "vue-router";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
import Local from "tools-utils/storage";
import { staticRoutes, notFoundAndNoPower } from "@/router/route";
import { initBackEndControlRoutes } from "@/router/backEndRoute";
import { NextLoading } from "@/utils/loading";
import { useLayoutStore } from "element-plus-layout/columns/layout-store";

// 创建一个可以被 Vue 应用程序使用的路由实例
export const router = createRouter({
  history: createWebHashHistory(),
  /**
   * 说明：
   * 1、notFoundAndNoPower 默认添加 404、401 界面，防止一直提示 No match found for location with path 'xxx'
   * 2、需要加 notFoundAndNoPower 404、401 界面。防止 404、401 不在 layout 布局中，不设置的话，404、401 界面将全屏显示
   */
  routes: [...notFoundAndNoPower, ...staticRoutes],
});

// 路由加载前
router.beforeEach(async (to, from, next) => {
  // 加载动画条
  NProgress.configure({ showSpinner: false });
  // 设置页面标题
  if (to.meta.title) NProgress.start();
  // 获取 token
  const token = Local.get("token");

  // 判断是否是登录页，如果是登录页，直接放行
  if (to.path === "/login" && !token) {
    next();
    NProgress.done();
    return;
  }

  // 判断是否有 token，如果没有，跳转到登录页
  if (!token) {
    next(`/login?redirect=${to.path}&params=${JSON.stringify(to.query ? to.query : to.params)}`);
    Local.clear();
    NProgress.done();
    return;
  }

  // 判断如果有 token，且跳转的是登录页，直接跳转到首页
  if (token && to.path === "/login") {
    next("/");
    NProgress.done();
    return;
  }

  // 判断是否有路由列表，如果没有，请求后端接口获取路由列表
  const layoutStore = useLayoutStore();
  const { mainAside } = storeToRefs(layoutStore);
  if (mainAside.value.length === 0) {
    try {
      // 后端控制路由：路由数据初始化，防止刷新时丢失
      await initBackEndControlRoutes();
      // 解决刷新时，一直跳 404 页面问题，关联问题 No match found for location with path 'xxx'
      // to.query 防止页面刷新时，普通路由带参数时，参数丢失。动态路由（xxx/:id/:name"）
      next({ path: to.path, query: to.query });
    } catch {
      // 清除 token，直接放行
      Local.remove("token");
      // 无权限，跳转到登录页
      next(`/login?redirect=${to.path}&params=${JSON.stringify(to.query ? to.query : to.params)}`);
    }
    return;
  }

  // 如果以上都不符合，直接放行
  next();
});

// 路由加载后
router.afterEach(() => {
  NProgress.done();
  NextLoading.done(300);
});

// 导出路由
export default router;
